<template>
    <div v-if="isShow">
        <div class="flexbox spacebetween">
            <p class="bolds">{{params.nowlottery}}</p>
            <p class="colorRed bolds">今天输赢：<span>{{ratedata.total.toFixed(1)}}</span></p>
            <p class="sontype" v-if="$route.query.id == 4">{{params.levellottery}}</p>
            <div class="gameresult flexbox bolds"  v-if="$route.query.id != 4">
                <p class="resultexp">{{lastPeriod}}期开奖</p>
                <div v-if="$route.query.id == 1 || $route.query.id == 3 || $route.query.id == 5 || $route.query.id == 6 || $route.query.id == 7 || $route.query.id == 8">
                    <span v-for="(item,index) in ballarr" :key="index" :class="[ (item > 9) ? 'No_gd' + item: 'No_gd0' + item]"></span>
                </div>
                <div style="width: 270px;" v-if="$route.query.id == 2">
                    <span v-for="(item,index) in ballarr" :key="index" :class="['b' + item]"></span>
                </div>
                <div v-if="$route.query.id == 9 || $route.query.id == 10">
                    <span v-for="(item,index) in ballarr" :key="index" :class="['jsk' + item]"></span>
                </div>
                <div v-if="$route.query.id == 14 || $route.query.id == 15">
                    <span v-for="(item,index) in ballarr" :key="index" :class="['No_gd' + item]"></span>
                </div>
            </div>
        </div>
        <div class="gameresult flexbox spacebetween bolds margintop" v-if="$route.query.id == 4">
            <p class="resultexp">{{lastPeriod}}期开奖</p>
            <div>
                <span v-for="(item,index) in ballarr" :key="index" :class="[ (item > 9) ? 'b' + item: 'b0' + item]"></span>
            </div>
        </div>
        <div class="flexbox spacebetween margintop">
            <p class="issuenum" v-if="isopen"><span>{{ratedata.period}}</span>期</p>
            <p class="sontype" v-if="$route.query.id != 4">{{params.levellottery}}</p>
            <p v-if="isopen">距离封盘：<span class="gameClosingtime">{{closetime}}</span></p>
            <p v-if="isopen">距离开奖：<span class="colorRed">{{resulttime}}</span></p>
            <p v-if="!isopen">距离开盘：<span class="colorRed">{{opentime}}</span></p>
            <p v-if="isopen">
                <span class="refreshBox" @click="refreshFun"><img src="../../../../assets/images/refresh.png" class="refresh" />立即刷新</span>
                <span class="gameRefreshtime">{{ninetime}}</span>秒
            </p>
        </div>
    </div>
</template>
<style scoped>
    .refreshBox{
        font-size: 12px;
        margin-right: 5px;
        cursor: pointer;
    }
    .refresh{
        width: 17px;
        vertical-align: bottom;
        margin-right: 3px;
    }
</style>
<script>
    import axios from 'axios'
    import {lotterytype} from '../../../../assets/js/lotterytype.js'
    export default {
        name: "Gamehead",
        data(){
            return{
                closetime: '',  //封盘  时间  分秒
                resulttime: '',  //开奖  时间  分秒
                opentime: '',  //开盘  时间  时分秒
                ninetime: 90,  //90秒倒计时
                params: {},  //菜单
                ratedata: {},  //实时赔率
                ballarr: [],  //开奖结果
                lastPeriod: '',  //开奖期号
                isopen: true,  //是否开盘
                Fpdifference: 0,  //封盘
                Kpdifference: 0,  //开盘
                againNine: false,  //90m刷新

                isShow: false,  //是否显示当前内容
            }
        },
        methods: {
            init(){
                // console.log(this.$route.query);
                var _this = this;
                this.params = lotterytype.apiParams(this.$route.query.id,this.$route.query.levelid);

                if(window.localStorage.Authorization){

                    _this.$httpGet('/api/game/listRate/'+ _this.params.nowlottery + '/' + _this.params.levellottery +'oa18').then(response => {
                
                        if(response.status == 200){
                            if(response.data.state == 'empty'){  //尚未开盘
                                _this.isopen = false;
                                //所有数据
                                _this.ratedata = response.data;
                                _this.opentime = _this.transformationDay( parseInt(response.data.next_open) - parseInt(response.data.server_time) );  //开盘时间

                                //倒数
                                _this.hourFun();

                            }else{

                                _this.isopen = true;
                                //所有数据
                                _this.ratedata = response.data;

                                //时间戳转 天、时、分、秒
                                _this.closetime = _this.transformationDay( parseInt(response.data.suspend) - parseInt(response.data.server_time) );  //距离封盘
                                _this.resulttime = _this.transformationDay( parseInt(response.data.close) - parseInt(response.data.server_time) );  //距离开盘

                                //倒数
                                _this.dayFun();
                                _this.nineinit();
                            }

                            
                            //中奖号码
                            _this.ballarr = response.data.result.balls.split(',');
                            //开奖期号
                            _this.lastPeriod = response.data.result.period;

                            _this.isShow = true;
                        }

                    });
                    

                }
                

            },
            //时间戳转天时分秒
            transformationDay(times){
                // console.log(times);
                if (times > 0) {
                    var days = parseInt(times / (60 * 60 *24));
                    if (days > 0) {
                        var hourSecounds = times - days*60*60*24;
                    } else {
                        var hourSecounds = times
                    }
                    var hours = parseInt(hourSecounds / 60 / 60);
                    if (hours > 0) {
                        var minSecouds = times - days*60*60*24 -  hours*60*60
                    } else {
                        var minSecouds = times -  days*60*60*24;
                    }
                    var minutes = parseInt(minSecouds / 60);
                    var seconds = times % 60;
                    
                    var d = true;
                    var h = true;
                    if (days == 0){
                         d= false;
                    }
                    if (hours == 0) {
                        h = false;
                    }
                    
                    if (d) {

                        return days + '天' +  this.add0(hours) + ':' + this.add0(minutes) + ':' + this.add0(seconds);

                    } else {
                        if (h) {
                            return this.add0(hours) + ':' + this.add0(minutes) + ':' + this.add0(seconds);
                        } else {
                            return this.add0(minutes) + ':' + this.add0(seconds);
                        }
                    }

                } else {
                    return '00:00';
                }

            },
            //时间戳转 分秒
            transformationTime(times){
                if (times > 0) {
                    var minutes = parseInt(times / 60);
                    var seconds = times % 60;
                    return this.add0(minutes) + ':' + this.add0(seconds);
                } else {
                    return '00:00';
                }
                
            },
            //时间戳转  时分秒
            transformationHour(times){
                if(times > 0){
                    var hours = parseInt(times / 60 / 60);
                    var minutes = parseInt(times / 60) % 60;
                    var seconds = times % 60;
                    return this.add0(hours) + ':' + this.add0(minutes) + ':' + this.add0(seconds);
                } else {
                    return '00:00:00';
                }
            },
            //分秒转时间戳
            timeTransformation(times){
                var front = parseInt(times.substr(0,2));
                var behind = parseInt(times.substr(3,2));
                var nowtime = front * 60 + behind;
                return nowtime;
            },
            //时分秒转时间戳
            hourTransformation(times){
                var hour = parseInt(times.substr(0,2));
                var minute = parseInt(times.substr(3,2));
                var second = parseInt(times.substr(6,2));
                var nowtime = hour * 60 * 60 + minute * 60 + second;
                return nowtime;
            },
            //时间  补十位
            add0(num){
                return num<10 ? '0'+num : num
            },
            //倒计时
            timeFun(){
                var _this = this;
                var timess = setInterval(function(){
                    
                    if(_this.closetime == '00:00'){  //封盘
                        //调用相应接口
                        clearTimeout(timess);
                        _this.closetime = '00:00';
                        _this.closeFun();
                    }else{
                        _this.closetime = _this.reciprocal(_this.closetime);
                    }

                },1000)

                var times = setInterval(function(){

                    if(_this.resulttime == '00:00'){  //开奖
                        //调用相应接口
                        clearTimeout(times);
                        _this.resultFun();
                        _this.inits();
                    }else{
                        _this.resulttime = _this.reciprocal(_this.resulttime);
                    }
                },1000)

            },
            //90 s
            nineinit(){
                var _this = this;
                var ninetimeset = setInterval(function(){
                    
                    if(_this.againNine){
                        _this.againNine = false;
                        clearTimeout(ninetimeset);
                        _this.ninetime = 90;  //重新开始计时
                        _this.nineinit();
                        
                    }else{
                        if(_this.ninetime == 0){  //90秒
                            //调用相应接口
                            _this.nineFun();
                            _this.ninetime = 90;  //重新开始计时
                        }else{
                            _this.ninetime--;
                        }
                    }
                    

                },1000)
            },
            //时分秒 倒计时
            hourFun(){
                var _this = this;
                var timess = setInterval(function(){
                    
                    if(_this.opentime == '00:00'){  //开盘
                        //调用相应接口
                        clearTimeout(timess);
                        _this.opentime = '00:00';
                        _this.inits();
                    }else{
                        _this.opentime = _this.reciprocaldays(_this.opentime);
                    }

                },1000)

            },
            //分秒
            reciprocal(time){
                var num = this.timeTransformation(time);
                num--;
                return this.transformationTime(num);
            },
            //时分秒
            reciprocals(time){
                var num = this.hourTransformation(time);
                num--;
                return this.transformationHour(num);
            },
            //天、时、分、秒
            dayFun(){
                var _this = this;
                var timess = setInterval(function(){
                    
                    if(_this.closetime == '00:00'){  //封盘
                        //调用相应接口
                        clearTimeout(timess);
                        _this.closetime = '00:00';
                        _this.closeFun();
                    }else{
                        _this.closetime = _this.reciprocaldays(_this.closetime);
                    }

                },1000)

                var times = setInterval(function(){

                    if(_this.resulttime == '00:00'){  //开奖
                        //调用相应接口
                        clearTimeout(times);
                        _this.resulttime = '00:00';
                        _this.resultFun();
                        _this.inits();
                    }else{
                        _this.resulttime = _this.reciprocaldays(_this.resulttime);
                    }
                },1000)
            },
            //天时分秒
            reciprocaldays(time){
                // console.log(time);
                var num = this.dayTransformation(time);
                num--;
                return this.transformationDay(num);
            },
            //天时分秒转时间戳
            dayTransformation(times){
                var ind = times.indexOf('天');
                if(ind > 0){

                    var day = parseInt(times.substring(0,ind));
                    var hour = parseInt(times.substring(ind+1,ind+3));
                    var minute = parseInt(times.substring(ind+4,ind+6));
                    var second = parseInt(times.substring(ind+7,ind+9));
                    var nowtime = day * 60 * 60 * 24 + hour * 60 * 60 + minute * 60 + second;

                }else{
                    var day = 0;
                    if(times.length > 5){  //时分秒
                        var hour = parseInt(times.substring(0,2));
                        var minute = parseInt(times.substring(3,5));
                        var second = parseInt(times.substring(6,8));
                        var nowtime = hour * 60 * 60 + minute * 60 + second;
                    }else{  //分秒
                        var minute = parseInt(times.substring(0,2));
                        var second = parseInt(times.substring(3,5));
                        var nowtime = minute * 60 + second;
                    }
                }
                
                return nowtime;
            },
            inits(){
                // console.log(this.$route.query);
                var _this = this;
                this.params = lotterytype.apiParams(this.$route.query.id,this.$route.query.levelid);
                
                this.$httpGet('/api/game/listRate/'+ this.params.nowlottery + '/' + this.params.levellottery +'oa18').then(response => {
                        
                    if(response.status == 200){
                        if(response.data.state == 'empty'){  //尚未开盘
                            _this.isopen = false;
                            //所有数据
                            _this.ratedata = response.data;
                            _this.opentime = _this.transformationDay( parseInt(response.data.next_open) - parseInt(response.data.server_time) );  //开盘时间

                            //倒数
                            _this.hourFun();

                        }else{

                            _this.isopen = true;
                            //所有数据
                            _this.ratedata = response.data;

                            //时间戳转 天、时、分、秒
                            _this.closetime = _this.transformationDay( parseInt(response.data.suspend) - parseInt(response.data.server_time) );  //距离封盘
                            _this.resulttime = _this.transformationDay( parseInt(response.data.close) - parseInt(response.data.server_time) );  //距离开盘

                            //倒数
                            _this.dayFun();
                        }

                        
                        //中奖号码
                        _this.ballarr = response.data.result.balls.split(',');
                        //开奖期号
                        _this.lastPeriod = response.data.result.period;
                    }

                });

            },
            //封盘
            closeFun(){
                // 不可下注
                this.$emit('noBet');
            },
            //开奖
            resultFun(){
                // 可下注  请求开奖（赔率）、账户信息、开奖结果、两面长龙接口、路珠（beadCount）接口
                this.$emit('openBet');
            },
            //90秒
            nineFun(){
                // 账户信息、开奖结果、两面长龙、路珠（beadCount）接口
                var i = 0;
                this.$emit('ninetime',i++);
            },
            refreshFun(){
                this.againNine = true;
                this.nineFun();
            },
            
        },
        mounted(){
            this.init();
            
        },
    }
</script>
